<template>
  <div>
    <el-tag v-for="(item, index) in historyAry" :key="index" :closable="index != 0 ? true : false" @close="closeTags(index)"
      @click="selectTags(index)" :effect="curIndex == index ? 'dark' : 'light'">
      <router-link :to="item.path" class="aa">{{ item.meta.name }}</router-link>
    </el-tag>
  </div>
</template>
  
<script>
export default {
  data() {
    return {
      curIndex: 0
    }
  },
  props: {
    historyAry: {
      type: Array,
      default: () => []
    }
  },
  methods: {
    closeTags(index) {
      //$emit(参数1,参数2)
      //参数1：自定义事件的名称,参数2：是传递的值
      this.$emit('closeTagEvent', index)
    },
    selectTags(index) {
      this.curIndex = index
    }
  }
}
</script>

<style scoped lang="scss">
.aa{
  text-decoration: none;
  color: black;
}
</style>